{{ define "mainTitle" }}
  {{ if not .Params.noBreadcrumb -}}<h5 class="no-toc">{{ partial "breadcrumb.html" .Parent }}</h5>{{- end }}
  {{ if not .Params.noTitle -}}<h1>{{ .Title }}</h1>{{- end }}
  {{ if not .Params.noDate -}}
  <small>
    <time class="" datetime="{{ .Date.Format "2006-01-02T15:04:05Z0700" }}">{{ .Date.Format "Mon, 2006/01/02" }}</time>
  </small>
  {{- end }}
  <p>
    {{ range .Params.tags }}
    <a href="/tags/{{ . | urlize }}/"><span class="tag is-small">{{ . }}</span></a>
    {{- end }}
    {{ range .Params.categories }}
    <a href="/categories/{{ . | urlize }}/"><span class="tag is-small text-primary bd-primary">{{ . }}</span></a>
    {{- end }}
  </p>
  {{ partial "ifex_partial" (slice "single-main-title" .) -}}
{{ end }}

{{ define "mainBody" }}
  <article id="content-body">
    {{ .Content }}
  </article>

  <div id="content-comment">
    {{ if (and .Site.Params.giscus.enable (not .Params.disableGiscus)) }}
      <script type="text/javascript" src="{{
        (
          resources.Get "res/script/giscus.js" |
          js.Build (dict
            "targetPath" "res/script/giscus.min.js"
            "minify" true
          ) |
          resources.Fingerprint
        ).RelPermalink
      }}"></script>
      <script>
        createGiscus({
          "repo":               "{{ .Site.Params.giscus.repo }}",
          "repoId":             "{{ .Site.Params.giscus.repoId }}",
          "category":           "{{ .Site.Params.giscus.category }}",
          "categoryId":         "{{ .Site.Params.giscus.categoryId }}",
          "mapping":            "{{ .Site.Params.giscus.mapping }}",
          "strict":             "{{ .Site.Params.giscus.strict }}",
          "reactionsEnabled":   "{{ .Site.Params.giscus.reactionsEnabled }}",
          "inputPosition":      "{{ .Site.Params.giscus.inputPosition }}",
          "lightTheme":         "{{
            (
              resources.Get (printf "res/style/giscus/light-%s.scss" .Site.Params.SiteTheme) |
              resources.ToCSS (dict
                "transpiler" "dartsass"
                "outputStyle" "compressed"
                "targetPath" (printf "res/style/giscus-light-%s.min.css" .Site.Params.SiteTheme)
              ) |
              resources.Fingerprint
            ).Permalink
          }}",
          "darkTheme":          "{{
            (
              resources.Get (printf "res/style/giscus/dark-%s.scss" .Site.Params.SiteTheme) |
              resources.ToCSS (dict
                "transpiler" "dartsass"
                "outputStyle" "compressed"
                "targetPath" (printf "res/style/giscus-dark-%s.min.css" .Site.Params.SiteTheme)
              ) |
              resources.Fingerprint
            ).Permalink
          }}",
          "containerId":        "content-comment"
        });
      </script>
    {{ end }}
  </div>

{{ end }}

{{ define "mainRight" }}
  {{ if not .Params.noTOC }}
  <div id="content-toc" class="toc hide-md"></div>
  {{ end }}
{{ end }}

{{ define "bodyEnd" }}
  {{ if not .Params.noTOC }}
    <link rel="stylesheet" href="/res/libs/tocbot/css/tocbot.css"></link>
    <style>
    #content-toc {
      position: -webkit-sticky;
      position: sticky;
      top: 7rem;
      padding-left: 2rem;
      padding-right: 1rem;
    }

    #content-toc a.toc-link {
      color: var(--font-color);
    }

    #content-toc a.toc-link.is-active-link {
      color: var(--color-darkGrey);
    }

    #content-toc a.toc-link::before {
      background-color: var(--bg-color);
    }

    #content-toc a.toc-link.is-active-link::before {
      background-color: var(--color-primary);
    }
    </style>
    <script src="/res/libs/tocbot/js/tocbot.min.js"></script>
    <script>
    document.addEventListener('DOMContentLoaded', (ev) => {
      tocbot.init({
        tocSelector: '#content-toc',
        contentSelector: '#main-center',
        ignoreSelector: '.no-toc',
        headingSelector: 'h1, h2, h3, h4, h5, h6',
        hasInnerContainers: false,
        headingsOffset: 80,
        scrollSmoothOffset: -80
      });
    });
    </script>
  {{ end }}
  {{ if not .Params.noAnchor }}
    <script type="text/javascript" src="/res/libs/anchorjs/js/anchor.min.js"></script>
    <script>anchors.add('#main-body h1, #main-body h2, #main-body h3, #main-body h4, #main-body h5, #main-body h6, #main-body dt');</script>
  {{ end }}
{{ end }}
